<template>
  <q-page class="flex-top">
    <q-input bottom-slots v-model="text" label="二维码的内容" counter :dense="dense" @keyup.enter="getQrcode()">
<template v-slot:append>
          <q-icon v-if="text !== ''" name="close" @click="text = ''" class="cursor-pointer" />
        </template>

        <template v-slot:hint>
          输入你要转换成二维码的内容
        </template>

        <template v-slot:after>
          <q-btn round dense flat icon="send" @click="getQrcode()">
            <q-tooltip content-class="bg-accent">输入你要变成二维码的字段</q-tooltip>
          </q-btn>
        </template>
      </q-input>
    <img v-show="img != ''" :src="img" alt="">
  </q-page>
</template>

<script>
import { post } from 'boot/axios'

export default {
  name: 'PageIndex',
  data () {
    return {
      text: '',
      dense: false,
      img: ''
    }
  },
  methods: {
    getQrcode () {
      var that = this
      if (that.text === '') {} else {
        console.log(that.text)
        that.img = ''
        post('qrcodelist/', { data: that.text }).then(response => {
          console.log(response.data)
          that.img = response.data.img
        }).catch(error => { console.log(error) })
      }
    }
  }
}
</script>
